<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>页面相关</title>
</head>
<body>
<input type="text">
<input type="button" value="添加h1" onclick="f1()">
<input type="button" value="添加div" onclick="f2()">
<input type="button" value="添加图片" onclick="f3()">
<script>
  let i = document.querySelector("input");
  function f1() {
    let h = document.createElement("h1");
    h.innerText = i.value;
    document.body.append(h);
  }
  function f2() {
    let d = document.createElement("div");
    d.innerText = i.value;
    document.body.append(d);
  }
  function f3() {
    let m = document.createElement("img");
    m.src = "u.png";
    m.width = 100;
    document.body.append(m);
  }
</script>
</body>
</html>